<template>
	<view class="page">
		<pageTxt>
			<!--  v-model="dataList" @query="queryList" -->
			<z-paging ref="paging" refresher-only @onRefresh="onRefresh" :paging-style="{ 'background-color': '#f7f7f7', height: '100%', width: '100%' }">
				<!-- 头部 -->
				<template slot="top">
					<u-navbar title="施工项目详情" :autoBack="true" :fixed="false"></u-navbar>
					<view class="tab-box">
						<u-tabs
							:current="tabIndex"
							@click="tabClickFunc"
							:list="tablist"
							inactiveStyle="color: #919092;"
							activeStyle="color: #3B75FF;"
							lineColor="#3B75FF"
						></u-tabs>
					</view>
				</template>
				<!-- 内容 -->
				<view class="detail-content-box" v-if="dataObj">
					<template v-if="tabIndex == 0">
						<u-empty
							v-if="!$fieldShowFunc('21-sgxx')"
							marginTop="300rpx"
							icon="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/no-msg2.png"
							text=" "
						></u-empty>
						<view class="item-box" v-if="$fieldShowFunc('21-sgxx')">
							<view class="title">施工信息</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_xmmc')">
								<text class="txt">项目名称</text>
								<view class="content">
									{{ dataObj.project_name || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_xmbh')">
								<text class="txt">项目编号</text>
								<view class="content">{{ dataObj.project_number || '--' }}</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_xmpp')">
								<text class="txt">项目品牌</text>
								<view class="content">
									{{ dataObj.brand_name || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_xmlx')">
								<text class="txt">项目类型</text>
								<view class="content">
									{{ dataObj.store_type_name || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_kclx')">
								<text class="txt">勘场类型</text>
								<view class="content">
									<template v-if="dataObj.survey_site == 1">无需勘场</template>
									<template v-if="dataObj.survey_site == 2">实地勘场</template>
									<template v-if="dataObj.survey_site == 3">勘场出图</template>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_sggcjl')">
								<text class="txt">施工工程经理</text>
								<view class="content">
									{{ dataObj.engineering_manager_name || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_gcjl')">
								<text class="txt">工程监理</text>
								<view class="content">
									{{ dataObj.engineering_supervision_name || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_sggz')">
								<text class="txt">施工工长</text>
								<view class="content">
									{{ dataObj.foreman_name || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_htkgrq')">
								<text class="txt">合同开工日期</text>
								<view class="content">
									{{ dataObj.contract_commencement_date || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_htwgrq')">
								<text class="txt">合同完工日期</text>
								<view class="content">
									{{ dataObj.contract_completion_date || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_htgq')">
								<text class="txt">合同工期</text>
								<view class="content">
									{{ dataObj.contract_duration_days ? dataObj.contract_duration_days + '天' : '--' }}
								</view>
							</view>
						</view>
					</template>
					<template v-if="tabIndex == 1">
						<u-empty
							v-if="!$fieldShowFunc('21-tzxx')"
							marginTop="300rpx"
							icon="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/no-msg2.png"
							text=" "
						></u-empty>
						<view class="item-box" v-if="$fieldShowFunc('21-tzxx')">
							<view class="title">图纸信息</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_pmtwj')">
								<text class="txt">平面图文件</text>
								<view class="content flex ac flex">
									<image
										v-for="(item, index) in dataObj.design_drawing.plan_drawing"
										:key="index"
										:src="$fileImgFunc(item)"
										@click="previewFunc(item)"
										mode="aspectFill"
										class="img-box"
									></image>
									<template v-if="!dataObj.design_drawing.plan_drawing.length">--</template>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_xgtwj')">
								<text class="txt">效果图文件</text>
								<view class="content flex ac flex">
									<image
										v-for="(item, index) in dataObj.design_drawing.effect_drawing"
										:key="index"
										:src="$fileImgFunc(item)"
										@click="previewFunc(item)"
										mode="aspectFill"
										class="img-box"
									></image>
									<template v-if="!dataObj.design_drawing.effect_drawing.length">--</template>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_sgtwj')">
								<text class="txt">施工图文件</text>
								<view class="content flex ac flex">
									<image
										v-for="(item, index) in dataObj.design_drawing.construction_drawing"
										:key="index"
										:src="$fileImgFunc(item)"
										@click="previewFunc(item)"
										mode="aspectFill"
										class="img-box"
									></image>
									<template v-if="!dataObj.design_drawing.construction_drawing.length">--</template>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_qtwj')">
								<text class="txt">其他文件</text>
								<view class="content flex ac flex">
									<image
										v-for="(item, index) in dataObj.design_drawing.other_file"
										:key="index"
										:src="$fileImgFunc(item)"
										@click="previewFunc(item)"
										mode="aspectFill"
										class="img-box"
									></image>
									<template v-if="!dataObj.design_drawing.other_file.length">--</template>
								</view>
							</view>
						</view>
					</template>
					<template v-if="tabIndex == 2">
						<u-empty
							v-if="!$fieldShowFunc('21-sgjd')"
							marginTop="300rpx"
							icon="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/no-msg2.png"
							text=" "
						></u-empty>
						<view class="item-box" v-if="$fieldShowFunc('21-sgjd')">
							<view class="title">施工进度</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_sgjd')">
								<text class="txt">施工进度</text>
								<view class="content">
									<template v-if="dataObj.construction_status == 42">待进场</template>
									<template v-if="dataObj.construction_status == 45">施工中</template>
									<template v-if="dataObj.construction_status == 50">已完工</template>
									<template v-if="dataObj.construction_status == 60">质保中</template>
									<template v-if="dataObj.construction_status == 70">质保到期</template>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_ysjd')">
								<text class="txt">验收进度</text>
								<view class="content">
									{{ dataObj.acceptance_progress || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_sjkgrq')">
								<text class="txt">实际开工日期</text>
								<view class="content">
									{{ dataObj.on_site_start_date || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_sjwgrq')">
								<text class="txt">实际完工日期</text>
								<view class="content">
									{{ dataObj.actual_completion_date || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_sjgq')">
								<text class="txt">实际工期</text>
								<view class="content">
									{{ dataObj.actual_duration ? dataObj.actual_duration + '天' : '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_swwcsj')">
								<text class="txt">收尾完成时间</text>
								<view class="content">
									{{ dataObj.closeout_complete_date ? dataObj.closeout_complete_date : '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_fxbq')">
								<text class="txt">风险标签</text>
								<view class="content">
									{{ dataObj.risk_label || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_cqlx')">
								<text class="txt">超期类型</text>
								<view class="content">
									{{ dataObj.overdue_type || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_cqyy')">
								<text class="txt">超期原因</text>
								<view class="content">
									{{ dataObj.reason_overdue || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_cqjhwgrq')">
								<text class="txt">超期计划完工日期</text>
								<view class="content">
									{{ dataObj.overdue_completion_date || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_zxrzsj')">
								<text class="txt">最新日志时间</text>
								<view class="content">
									{{ dataObj.log_date || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_zxsgjd')">
								<text class="txt">最新施工阶段</text>
								<view class="content">
									{{ dataObj.construction_stage || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_zxsgnr')">
								<text class="txt">最新施工内容</text>
								<view class="content">
									{{ dataObj.content || '--' }}
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_xczpsp')">
								<text class="txt">现场照片/视频</text>
								<view class="content flex ac flex">
									<image
										v-for="(item, index) in dataObj.constructionFiles"
										:key="index"
										:src="$fileImgFunc(item)"
										@click="previewFunc(item)"
										mode="aspectFill"
										class="img-box"
									></image>
									<template v-if="!dataObj.constructionFiles.length">--</template>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_yzg')">
								<text class="txt">已整改</text>
								<view class="content flex ac">
									<view
										v-if="$isPer(per_arr, ['constructionDetail_zgdDetail'])"
										@click="navToRecFunc(dataObj.rectified, 30)"
										:class="dataObj.rectified ? 'txt-btn' : ''"
									>
										{{ dataObj.rectified }}项
									</view>
									<view v-else>{{ dataObj.rectified }}项</view>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_wzg')">
								<text class="txt">未整改</text>
								<view class="content flex ac">
									<view
										v-if="$isPer(per_arr, ['constructionDetail_zgdDetail'])"
										@click="navToRecFunc(dataObj.not_rectified, 40)"
										:class="dataObj.not_rectified ? 'txt-btn' : ''"
									>
										{{ dataObj.not_rectified }}项
									</view>
									<view v-else>{{ dataObj.not_rectified }}项</view>
								</view>
							</view>
						</view>
					</template>
					<template v-if="tabIndex == 3">
						<u-empty
							v-if="!$fieldShowFunc('21-shjd')"
							marginTop="300rpx"
							icon="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/no-msg2.png"
							text=" "
						></u-empty>
						<view class="item-box" v-if="$fieldShowFunc('21-shjd')">
							<view class="title">售后进度</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_shywc')">
								<text class="txt">已完成</text>
								<view class="content flex ac">
									<view
										v-if="$isPer(per_arr, ['constructionDetail_shList'])"
										@click="navToAfterFunc(dataObj.after_sales_completed, 3)"
										:class="dataObj.after_sales_completed ? 'txt-btn' : ''"
									>
										{{ dataObj.after_sales_completed }}次
									</view>
									<view v-else>{{ dataObj.after_sales_completed }}次</view>
								</view>
							</view>
							<view class="item-box-item flex jb" v-if="$fieldShowFunc('sg_shwwc')">
								<text class="txt">未完成</text>
								<view class="content flex ac">
									<view
										v-if="$isPer(per_arr, ['constructionDetail_shList'])"
										@click="navToAfterFunc(dataObj.after_sales_not_completed, 4)"
										:class="dataObj.after_sales_not_completed ? 'txt-btn' : ''"
									>
										{{ dataObj.after_sales_not_completed }}次
									</view>
									<view v-else>{{ dataObj.after_sales_not_completed }}次</view>
								</view>
							</view>
						</view>
					</template>
				</view>
				<view class="bottom-btn-box flex ac jb" slot="bottom">
					<view style="width: 100%" v-if="!loading">
						<judgeBtn info :per_arr="per_arr" :btns="btns" objectType="project" :state="dataObj.construction_status" :item="dataObj" @change="btnsChange"></judgeBtn>
					</view>
				</view>
			</z-paging>
		</pageTxt>
		<!-- 文件预览 -->
		<preFileCom :fileObj="fileObj" @onFileSuccess="fileObj = ''"></preFileCom>
		<!-- 操作组件 -->
		<constructionOperate :value.sync="per_name" :oper_item="oper_item" @submit="handleSubmit"></constructionOperate>
	</view>
</template>

<script>
export default {
	provide() {
		return {
			providedData: this.btns
		};
	},
	data() {
		return {
			fileObj: '',
			loading: false,
			dataList: [],
			tabIndex: 0,
			tablist: [
				{
					name: '施工信息'
				},
				{
					name: '图纸信息'
				},
				{
					name: '施工进度'
				},
				{
					name: '售后进度'
				}
			],
			dataObj: '',
			per_arr: [], //权限列表
			// 操作按钮
			btns: [
				{
					per_name: 'projects_projectQualityRating',
					state: 50,
					name: '项目质量评分'
				},
				{
					per_name: 'edit_manager',
					func: (item) => {
						if (item.engineering_manager_name) {
							return true;
						} else {
							return false;
						}
					},
					name: '更换施工工程经理'
				},
				{
					per_name: 'add_manager',
					func: (item) => {
						if (!item.engineering_manager_name && item.construction_status == 35) {
							return true;
						} else {
							return false;
						}
					},
					name: '分配施工工程经理'
				},
				{
					per_name: 'construction_submit',
					func: (item) => {
						if (item.engineering_manager_name && item.construction_status == 42) {
							return true;
						} else {
							return false;
						}
					},
					name: '开工'
				},
				{
					per_name: 'refuse_orders',
					func: (item) => {
						if (item.engineering_manager_id == uni.getStorageSync('userInfo').id && item.construction_status == 42 && item.status < 1092) {
							return true;
						} else {
							return false;
						}
					},
					name: '拒绝接单'
				}
			],
			// 操作相关
			per_name: '',
			oper_item: {}
		};
	},
	onLoad(option) {
		this.engineeringProjectDetails(option.id);
		// 获取权限
		this.$Api
			.getHtmlAuthority({
				path: '/constructionManagement'
			})
			.then((res) => {
				console.log(res, 'getHtmlAuthority');
				if (res.code == 200) {
					this.per_arr = res.data.permission;
				}
			});
	},
	onShow() {
		if (this.dataObj) {
			this.engineeringProjectDetails(this.dataObj.id);
		}
	},
	methods: {
		// 操作反馈
		handleSubmit(e) {
			this.onRefresh();
		},
		// 操作事件
		btnsChange(e) {
			console.log(e);
			this.per_name = e.per_name;
			this.oper_item = e.item;
		},
		onRefresh() {
			this.engineeringProjectDetails(this.dataObj.id);
			this.$refs.paging.complete();
		},
		tabClickFunc(e) {
			this.tabIndex = e.index;
		},
		// 详情
		engineeringProjectDetails(project_id) {
			this.loading = true;
			this.$Apipc
				.engineeringProjectDetails({
					project_id
				})
				.then((res) => {
					console.log(res, '施工项目详情');
					this.loading = false;
					if (res.code == 200) {
						this.dataObj = res.data;
					}
				});
		},
		// 预览
		previewFunc(item) {
			this.fileObj = item;
		},
		// 查看整改单
		navToRecFunc(num, rectification_status) {
			if (!num) return;
			uni.navigateTo({
				url: '/pagesA/engineeringManagement/engineeringManagement?project_name=' + this.dataObj.project_name + '&tabIndex=4&rectification_status=' + rectification_status
			});
		},
		// 查看售后
		navToAfterFunc(num, after_status) {
			if (!num) return;
			uni.navigateTo({
				url: '/pagesA/engineeringManagement/engineeringManagement?project_name=' + this.dataObj.project_name + '&tabIndex=5&after_status=' + after_status
			});
		}
	}
};
</script>

<style lang="scss" scoped></style>
